Beyond jQuery by Ray Nicholus

Author:Ray Nicholus
Language: eng
Format: epub
Publisher: Apress, Berkeley, CA

At the top of the preceding code, I’m simply selecting elements needed by our move operation. The last line is the most important one. Since the insertBefore() method is defined on the Node object’s prototype, we must call insertBefore() on an DOM object that implements this interface. In fact, this element must be a parent element of the Node we are moving. Since we are moving the “vanilla” <li> element, we can use its parent—the “flavors” <ul>.

The first parameter passed to insertBefore() is the element we want to relocate: the “vanilla” list item. The second parameter is the “reference node.” This is the Node that will become the next sibling of our target element (the “vanilla” <li>) after the move operation. Since we want to move “vanilla” before “strawberry,” the “strawberry” <li> is our reference node.

We’ve reordered our flavors, but we still need to move the flavors heading and list to the top of our document. We can easily accomplish this goal with the insertBefore() method as well:

1 var headings = document.querySelectorAll('h2'),

2 flavorsHeading = headings[0],

3 typesHeading = headings[1],

4 typesList = document.querySelector('.types');

5

6 document.body.insertBefore(typesHeading, flavorsHeading);

7 document.body.insertBefore(typesList, flavorsHeading);

Download

Copyright Disclaimer:
This site does not store any files on its server. We only index and link to content provided by other sites. Please contact the content providers to delete copyright contents if any and email us, we'll remove relevant links or contents immediately.